<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('网店商品信息')" />
	<th:block th:include="include :: list-css" />
	<style type="text/css">
		label.layui-form-label {width: 95px;padding-right: 0px;}
		.layui-form-radio {margin-top:0}
		.importTable{empty-cells:show;border-collapse:collapse;border-spacing:0;}
		.listext th{background:#eee;color:#3366cc;}
		.listext th,.listext td{border:solid 1px #ddd;text-align:left;padding:10px;font-size:14px;}
		table img{width: 80px;}
		.table-box {width: 99.5%;margin-top: 10px; height: 85vh;overflow-y: auto;border: 1px solid #aaa;}
        table {width: 100%;table-layout: auto;}
        table thead th {position: sticky;top: -1px;z-index: 10;}
		#importProgress {z-index:20200202;background-color: #000;opacity: 0.3;display:none;}
		.importProgress {width:300px;z-index:20202222;position: fixed;top: 34%;left: 40%;display:none;}
		table.gridtable {font-family: verdana,arial,sans-serif;font-size:11px;color:#333333;border-width: 1px;border-color: #aaa;border-collapse: collapse;}
		table.gridtable th {border-width: 1px;padding:5px;border-style: solid;border-color: #aaa;background-color: #f4f4f4;text-align: center;z-index: 9999;}
		table.gridtable td {border-width: 1px;padding:5px;border-style: solid;border-color: #aaa;background-color: #ffffff;text-align: center;}
		#demopage{text-align: right;}
		.ishide{display: none;}
		.bagimg{z-index: 999;max-width:250px;border: 5px solid #23b971}


		/* .layui-table-box{overflow-x: auto !important;}
		.layui-table-header{display: inline-block !important;} */
	</style>
</head>
<body>
	<div class="ishide"><img class="bagimg" src=""></div>
<div class="main-content">
	<div class="content-right">
		<div class="search-top">
			<span>查询条件</span>
			<a href="javascript:;" layadmin-event="flexible" class="menuBtn">
				<i class="layui-icon layui-icon-spread-left" id="LAY_app_flexible" style="color: #fff;"></i>
			</a>
		</div>
		<div class="panel layout-expand layui-expand-east">
		    <div class="panel-header">
		        <div class="panel-tool" style="text-align: center; width: 26px;height: 30px;line-height: 30px;">
		            <a href="javascript:;" layadmin-event="flexible" class="menuBtn">
		                <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible" style="color: #fff;"></i>
		            </a>
		        </div>
		    </div>
		    <div class="panel-body panel-title" style="text-align: center; width: 26px;">查<br>询<br>条<br>件</div>
		</div>
       	<form class="layui-form">
			<th:block th:include="listinclude :: searchRight('page')" />
		</form>
   	</div>
    <div class="mid-content">
		<div class="layui-btn layui-table-tools importbtn-bg" onclick="importBtn()" lay-event="importBtn" shiro:hasPermission="hr:amazonanalysis:export">
			<i class="dhicon dh-upload"></i> 导入分析报告
        </div>
		<div class="layui-btn layui-table-tools importbtn-bg" onclick="exportbtn()" lay-event="exportbtn" shiro:hasPermission="hr:amazonanalysis:export">
			<i class="dhicon dh-download"></i> 导出
        </div>
		<div class="table-box">
        	<table class="gridtable" >
        		<thead>
        			<tr class="tablehead">
        				<th style="min-width:100px">图片</th>
        				<th style="min-width:140px">商品编码</th>
        				<th style="min-width:150px">商品名称</th>
        				<th style="min-width:120px">SKU</th>
        				<th style="min-width:120px">FNSKU</th>
        				<th style="min-width:70px">月销量</th>
        				<th style="min-width:70px">在库库存</th>
        				<th style="min-width:70px">在途库存</th>
        				<th style="min-width:70px">可发库存</th>
        				<th style="min-width:100px">所属店铺</th>
        				<th style="min-width:120px">所属运营公司简称</th>
        				<th style="min-width:100px">项目</th>
        			</tr>
        		</thead>
        		<tbody class="tablebody"></tbody>
        		
        	</table>
        </div>
		<div id="demopage"></div>
		<!-- <table class="layui-hide" id="dhtable" lay-filter="ftable"></table> -->
	</div>
</div>

<script type="text/template" id="importTpl">
	<form enctype="multipart/form-data" class="mt20 mb10">
		<div class="col-xs-offset-1">
			<input type="file" id="file" name="file"/>
			<div class="mt10 pt5">
				 <a onclick="$.tablelist.importTemplate('/hr/amazonanalysis/exporttemplate')" class="btn btn-default btn-xs"><i class="dhicon dh-file-excel-o"></i> 下载模板</a>
			</div>
			<font color="red" class="pull-left mt10">提示：仅允许导入“xls”或“xlsx”格式文件！</font>
		</div>
	</form>
</script>
<!-- 导入明细 -->
<div id="iTable" class="display_no">
	<table class="importTable listext" data-resizable-columns-id="demo-table">
	    <tbody id="itbody"></tbody>
	</table>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: businessJS" />
<th:block th:include="include :: searchJS" />
<th:block th:include="listinclude :: list-templeat" />
<script th:inline="javascript">
	/*<![CDATA[*/
	var prefix = ctx + "hr/amazonanalysis";
	var gridColumns = [[${gridColumns}]], 
		moduleTable =[[${moduleTable}]];
		importFields =[[${importFields}]],
		business=[[${business}]];
	/*]]>*/
</script>
<script type="text/javascript">
var element,thStr;
var fieldWidth = {},		//导入列表字段宽度
	filedRequired = {},		//导入列表必填字段
	dateFiled = [],			//导入列表日期字段
	hasNull = false;		//导入数据必填字段有空值
$.each(gridColumns.dictionaryForPageFieldList,function(i,v){
	fieldWidth[v.fields] = v.fieldFrontWidth
	if(v.fieldFrontRequired)filedRequired[v.fields] = v.fieldName;
	if(v.fieldFrontType == 't_date')dateFiled.push(v.fields);
})

var limit=20,page=1,count=0;
var $,layer,laydate,form,table,wherestr={};
layui.use(['table','laydate','form','layer','jquery','element','laypage'], function () {
	$ = layui.$, layer = layui.layer,laydate = layui.laydate , form = layui.form, table = layui.table, element = layui.element, laypage = layui.laypage;
	// serachRender();//查询条件初始渲染集合
	// changeDropdown('fSl');//导入窗口——税率下拉可编辑赋事件
	// $.tablelist.init({
	// 	elem: '#dhtable'
	// 	,modalName: "产品信息"
	// 	,url: prefix + '/list'
	// 	,updateUrl: prefix + "/edit?guid={id}"
	// 	,totalRow: gridColumns.totalRow
	// 	,cols: [gridColumns.gridBody]
	// 	,toolbar: '#toolbar'
	// 	,defaultToolbar: [{title:'列设置',layEvent: 'fieldSet',icon: 'layui-icon-set'}] //这里在右边显示
	// 	,height:'full-65'
    //     ,parseData: function(res){ //res 即为原始返回的数据
	// 		var objpage=sessionStorage.getItem(moduleTable+'checkdata')
	// 		if(objpage){
	// 			objpage=JSON.parse(objpage)
	// 			res.data.map((v,i)=>{
	// 				objpage.map((n,m)=>{
	// 					 if(v.guid==n.guid){
	// 						v.LAY_CHECKED=true
	// 					 }
	// 				})
	// 			})
	// 		}
	// 	}
	// });
	var weekArr=[]
	$(function(){
		var str=''
		for(var i=0;i>-7;i--){
			weekArr.push(weekdate(i))
           str+=`<th style="min-width:55px">${weekdate(i)}</th>`
		}
		$('.tablehead').append(str)
		tablelist(page)
    });
    function weekdate(aa){
        var date1 = new Date(),  
        time1=date1.getFullYear()+"-"+(date1.getMonth()+1)+"-"+date1.getDate();//time1表示当前时间  
        var date2 = new Date(date1);  
        date2.setDate(date1.getDate()+aa);
		var year= date2.getFullYear()
		var month=date2.getMonth()+1
		var day=date2.getDate()
		if(JSON.stringify(month).length==1)month='0'+month
		if(JSON.stringify(day).length==1)day='0'+day
        var time2 =year+"-"+month+"-"+day; 
		return time2
	}
	//搜索
	$('#btn-search').on('click', function () {
		tablelist(1,getWherestr())
    });
	//调用分页
	function pages(num,curr){
		laypage.render({
	    	elem: 'demopage',
	    	limit: limit,
	    	count: num,
			curr:curr,
			layout: ['limit','count', 'prev', 'page', 'next']
			,limits: [10,20,30,50]
			,page: true
	    	,jump: function(obj, first){
				limit = obj.limit;
				if(!first){
					document.documentElement.scrollTop = 0
                    document.body.scrollTop = 0
					tablelist(obj.curr,getWherestr())
				}
	    	}
	    });
	}
	function tablelist(page,data){
		showloadings(true)
		$.get(prefix + '/list?page='+page+'&limit='+limit,data,function(res){
		   var str=''
		   count=res.count
		   if(res.data.length>0){
			for(var i=0;i<res.data.length;i++){
			    for(var n=0;n<6;n++){
			    	if(n==0){
			    		str+=`<tr ondblclick="topath('${res.data[i].sellerSku}')"><td rowspan="6"><img src='${res.data[i].mainImage}'/></td><td rowspan="6">${res.data[i].code ?res.data[i].code :''}</td><td rowspan="6">${res.data[i].name ?res.data[i].name :''}</td><td rowspan="6">${res.data[i].sellerSku ?res.data[i].sellerSku :''}</td><td rowspan="6">${res.data[i].fnSku ?res.data[i].fnSku :''}</td><td rowspan="6">${res.data[i].monthlySales ?res.data[i].monthlySales :''}</td><td rowspan="6">${res.data[i].kNum ?res.data[i].kNum :''}</td><td rowspan="6">${res.data[i].iNum ?res.data[i].iNum :''}</td><td rowspan="6">${res.data[i].stock ?res.data[i].stock :''}</td><td rowspan="6">${res.data[i].shopName ?res.data[i].shopName :''}</td><td rowspan="6">${res.data[i].vGsMc ?res.data[i].vGsMc :''}</td><td>订单数量</td>`
			    	    for(var m=0;m<weekArr.length;m++){
							var index=false
                            for(var x=0;x<res.data[i].amazonAnalysisList.length;x++){
			    				if(weekArr[m]==res.data[i].amazonAnalysisList[x].purchaseDate){
									index=true
			    					str+=`<td>${res.data[i].amazonAnalysisList[x].orderSum ?res.data[i].amazonAnalysisList[x].orderSum :''}</td>`
			    				}
			    			}
							if(!index){
			    				str+=`<td></td>`
							}
			    		}
			    	    str+=`</tr>`
			    	}else if(n==1){
			    		str+=`<tr ondblclick="topath('${res.data[i].sellerSku}')"><td>商品售价</td>`
			    		for(var m=0;m<weekArr.length;m++){
							var index=false
                            for(var x=0;x<res.data[i].amazonAnalysisList.length;x++){
			    				if(weekArr[m]==res.data[i].amazonAnalysisList[x].purchaseDate){
									index=true
			    					str+=`<td>${res.data[i].amazonAnalysisList[x].itemPrice ?res.data[i].amazonAnalysisList[x].itemPrice :''}</td>`
			    				}
			    			}
							if(!index){
			    				str+=`<td></td>`
							}
			    		}
			    		str+=`</tr>`
			    	}else if(n==2){
			    		str+=`<tr ondblclick="topath('${res.data[i].sellerSku}')"><td>商品排名</td>`
			    		for(var m=0;m<weekArr.length;m++){
							var index=false
                            for(var x=0;x<res.data[i].amazonAnalysisList.length;x++){
			    				if(weekArr[m]==res.data[i].amazonAnalysisList[x].purchaseDate){
									index=true
			    					str+=`<td>${res.data[i].amazonAnalysisList[x].salesRank ?res.data[i].amazonAnalysisList[x].salesRank :''}</td>`
			    				}
			    			}
							if(!index){
			    				str+=`<td></td>`
							}
			    		}
			    		str+=`</tr>`
			    	}else if(n==3){
			    		str+=`<tr ondblclick="topath('${res.data[i].sellerSku}')"><td>会话次数</td>`
			    		for(var m=0;m<weekArr.length;m++){
							var index=false
                            for(var x=0;x<res.data[i].amazonAnalysisList.length;x++){
			    				if(weekArr[m]==res.data[i].amazonAnalysisList[x].purchaseDate){
									index=true
			    					str+=`<td>${res.data[i].amazonAnalysisList[x].sessionsNum ?res.data[i].amazonAnalysisList[x].sessionsNum :''}</td>`
			    				}
			    			}
							if(!index){
			    				str+=`<td></td>`
							}
			    		}
			    		str+=`</tr>`
			    	}else if(n==4){
			    		str+=`<tr ondblclick="topath('${res.data[i].sellerSku}')"><td>推荐报价百分比</td>`
			    		for(var m=0;m<weekArr.length;m++){
							var index=false
                            for(var x=0;x<res.data[i].amazonAnalysisList.length;x++){
			    				if(weekArr[m]==res.data[i].amazonAnalysisList[x].purchaseDate){
									index=true
			    					str+=`<td>${res.data[i].amazonAnalysisList[x].recommendPrice ?res.data[i].amazonAnalysisList[x].recommendPrice :''}</td>`
			    				}
			    			}
							if(!index){
			    				str+=`<td></td>`
							}
			    		}
			    		str+=`</tr>`
			    	}else if(n==5){
			    		str+=`<tr ondblclick="topath('${res.data[i].sellerSku}')"><td>商品会话百分比</td>`
			    		for(var m=0;m<weekArr.length;m++){
							var index=false
                            for(var x=0;x<res.data[i].amazonAnalysisList.length;x++){
			    				if(weekArr[m]==res.data[i].amazonAnalysisList[x].purchaseDate){
									index=true
			    					str+=`<td>${res.data[i].amazonAnalysisList[x].commoditySession ?res.data[i].amazonAnalysisList[x].commoditySession :''}</td>`
			    				}
			    			}
							if(!index){
			    				str+=`<td></td>`
							}
			    		}
			    		str+=`</tr>`
			    	}
    
			    }
		    }
		   }else{
			   str+=`<tr><td colspan="19" style="height:40px">暂无数据</td></tr>`
		   }
		   
		   $('.tablebody').html(str)
		   pages(count,page);

		    $("body img").mouseenter(function () {
              var aimgurl=$(this).attr('src')
              $('.ishide').show()
              $('.bagimg').css({position: 'absolute',top:$(this).offset().top,left:$(this).offset().left+90})
              $('.bagimg').attr('src',aimgurl)
            });
            $("body img").mouseleave(function () {
                $('.ishide').hide()
            });
			showloadings(false)
		})
	}

	window.importBtn=function(){
	    if (importFields) {
            thStr = '<tr><th><div style="width:30px;">序号</div></th>';
            $.each(importFields, function (i, val) {
                fieldWidth[val] = fieldWidth[val] ? fieldWidth[val] : 100;	//默认宽度100px
                thStr += '<th><div style="width:' + fieldWidth[val] + 'px;">' + i + '</div></th>';
            })
            thStr += '</tr>';
            layer.open({
                type: 1,
                area: ['400px', '230px'],
                fix: false, 
                offset: '10%',
                maxmin: true,
                shade: 0.3,
                title: '导入',
                content: $('#importTpl').html(),
                btn: ['<i class="dhicon dh-check"></i> 导入', '<i class="dhicon dh-remove"></i> 取消'],
                shadeClose: true,
                zIndex: 1000,
                btn1: function (index, layero) {
                    var file = layero.find('#file');
                    if (!file[0]['value']) {
                        layer.msg("请选择文件！");
                        return false;
                    }
                    var imRes = importListExcel(file[0], importFields, 'amazonanalysis');
                }
            });
        } else {
            $.modal.alertWarning("后台未返回导入模板对象！");
        }
   }

   window.exportbtn=function (){
	    $.ajax({
	        url: '/hr/amazonanalysis/export',
	        type: 'GET',
	        data: getWherestr(),
	        dataType: 'json',
	        beforeSend: function(){
	    		showloadings(true);
	        },
	        success: function(result){
	        	if (result.code == 0) {
	    	        window.location.href = ctx + "common/download?fileName=" + encodeURIComponent(result.msg) + "&delete=" + true;
	    	        parent.$('.page-loading').hide();//页面进行了跳转刷新，需要手动关闭页面的加载动画
	    		} else if (result.code == web_status.WARNING) {
	               $.modal.alertWarning(result.msg)
	        	} else {
	    			$.modal.alertError(result.msg);
	    		}
	       		showloadings(false);
	        }
	    });
   }
 });

function topath(sellerSku){
	  top.layui.index.openTabsPage("/hr/amazonanalysis/findByAsin?sellerSku="+sellerSku,'运营分析 - 详情')
}

/*批量请求导入数据
 *tobj：导入数据对象
 *startNum：从第几条开始导入
 *oneImportNum：每次导入条数
 *allImportNum：总数据量
 *times：导入次数
 */
 function eachImport(tobj,startNum, oneImportNum, allImportNum, times, timeNum){
	var importObj = [], inum = startNum, importBl='0%';
	for(var i = startNum; i < startNum + oneImportNum; i++){
		if(i >= allImportNum)break;
		inum = i + 1 ;
		importObj.push(tobj[i]);
	}
	$.ajaxSettings.async = false;
	$.post("/hr/amazonanalysis/importdatapost", {'infoItems':JSON.stringify(importObj, null, 2)}, function(result) {
		importBl = (inum/allImportNum)*100;
		importObj = [];
		timeNum += 1;
		showloadings(false);
		layer.msg(result.msg)
		if(result.code==0){
			location.reload();
		}
    },"json");
}


</script>
</body>
</html>